<template>
	<!-- 轮播图 -->
	<view class="uni-margin-wrap">
	  <swiper class="swiper" circular :indicator-dots="true" :autoplay="true" :interval="2000" :duration="500">
	    <swiper-item>
	      <view class="swiper-item uni-bg-red">
	        <image style="width: 100%;height: 690rpx;" src="../../static/detail1.jpg"></image>
	      </view>
	    </swiper-item>
	    <swiper-item>
	      <view class="swiper-item uni-bg-green">
	        <image style="width: 100%;height: 690rpx;" src="../../static/detail2.jpg"></image>
	      </view>
	    </swiper-item>
	    <swiper-item>
	      <view class="swiper-item uni-bg-blue">
	        <image style="width: 100%;height: 690rpx;" src="../../static/detail3.jpg"></image>
	      </view>
	    </swiper-item>
	  </swiper>
	</view>
	<!-- 图文详情 -->
	<view class="content">
		<text class='goodName'>雪屋加湿器小型家用静音空气大喷雾</text>
		<text class='pictureText'>           ———宝贝详情———</text>
		
		<view class='detail'>
			<image src="../../static/goodDetail/1.jpg" style="height: 600rpx;"></image>
			<image src="../../static/goodDetail/2.jpg" style="height: 500rpx;"></image>
			<image src="../../static/goodDetail/3.jpg" style="height: 650rpx;"></image>
			<image src="../../static/goodDetail/4.jpg" style="height: 750rpx;"></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style>
 /* 轮播图 */
  .uni-margin-wrap {
    width: 690rpx;
    width: 100%;
  }

  .swiper {
    height: 690rpx;
  }

  .swiper-item {
    display: block;
    height: 400rpx;
    line-height: 400rpx;
    text-align: center;
    border-radius: 5%;
  }

/* 图文详情 */
.goodName {
	display: block;
	padding-bottom: 50rpx;
}
.pictureText {
	color: #acacac;
	margin: 30rpx;
	padding-top:100rpx;
	text-align: center;
}

.content {
	padding-top: 50rpx;
}
  
  .detail image {
	  width: 100%;
	  padding: 0%;
  }

</style>
